<template>
  <!-- 歌单广场 -->

  <a-space direction="vertical">
    <a-button shape="round" v-for="(item, index) in defaultTags" :key="index">
      {{ item }}
    </a-button>
  </a-space>
</template>

<script setup>
import { ref, onMounted } from 'vue'

const defaultTags = ref(['推荐', '官方', '华语', '摇滚', '民谣', '电子', '轻音乐'])

const playlistCatlist = ref([])
const playlist = ref([])

const items = ref([])

import { fetchPlaylistCatlist, fetchPlaylistHighquality } from '@/api/index.js'

onMounted(async () => {
  const PlaylistCatlist = await fetchPlaylistCatlist()

  // 假设 response.sub 是一个数组
  if (PlaylistCatlist.sub && Array.isArray(PlaylistCatlist.sub)) {
    items.value = PlaylistCatlist.sub.filter(
      (item) => item.type === 0 && item.resourceType === 0 && item.hot === true,
    )
  }

  const PlaylistHighquality = await fetchPlaylistHighquality()
  playlist.value = PlaylistHighquality.playlists

  console.log('PlaylistHighquality:', playlist.value)
})
</script>
